<style>
	ul li{list-style-type:none;}
	.installationMode{
		width:90%;
		height:100%;
		margin:0 auto;
	}
	.installationMode tr th{
		padding:4% 10% 4% 9% ;
		text-align:left;
	}
	.installationMode ul{
		padding:4% 1% 4% 10% ;
        color: #ffffff;
        border-radius: 8px;
		background-color:#880015;
	}
	.installationMode ul h3{
		font-weight: 600;
		padding-bottom:15px;
	}
	.installationMode ul .mode_li{
		padding-left:40px;
	}
	#cluster span{
		font-size:15px;
		float:left;
		width:33.3%;
		padding:5px 0px;
	}
	
</style>

<div class="row">
	<div class="col-xs-12">
		<div class="box">
			<!-- /.box-header -->
			<div class="box-body">
				<div style="padding-bottom: 5px;">	
					<h3 id="installtitle">您的计算机软件未安装，请安装！</h3>
				</div>
				<div id="cluster" style="padding:0px 0px 10px 0px;"></div>
				<table id="example1" class="installationMode">
					<thead>
						
					</thead>
				</table>
			</div>
			<!-- /.box-body -->
		</div>
		<!-- /.box -->
	</div>
	<!-- /.col -->
</div>
<!-- /.row -->
<script>
//$.dailyInit();

$.ajax({
    url:"/cluster/1",
    type: "GET",
    dataType:"json",
    success: function(data){
    	if(data.installType==1){
			install(data);
		}else{
			installed(data);
		}
    }
}); 

//未完成安装
function install(installType){
	$("#cluster").html("");
	$("#example1").attr('class','installationMode')
	$("#example1").attr('font-size','')
	$.ajax({
	    url:"/deploycluster/listtemplates",
	    type: "GET",
	    dataType:"json",
	    success: function(data){
	    	var count=1;
			var tableList="";
	        $.each(data,function(i,item){
	        	tableList += [
	                 count%2==1?'<tr>':'',
	                 count%2==1?'<th id="'+item.id+'" c="'+item.maxNodes+'"><ul class="Mode"><li><h3>'+item.name+'</h3></li><li class="mode_li">要求：最少'+item.minNodes+'节点,最大'+item.maxNodes+'节点</li><li class="mode_li">'+item.describe+'</li></ul></th>':'',
	                 count%2==0?'<th id="'+item.id+'" c="'+item.maxNodes+'"><ul><li><h3>'+item.name+'</h3></li><li class="mode_li">要求：最少'+item.minNodes+'节点,最大'+item.maxNodes+'节点</li><li class="mode_li">'+item.describe+'</li></ul></th>':'',
	                 count%2==0?'</tr>':''
	            ].join('');
	           
	            count++;
	        }); 
	       
	        $("#example1").html(tableList);  
	        
	        $( '#example1' ).find('th').bind('click',function(){
	        	if($( this ).attr('id')==0){
	        		$(".content").load("singleNode.html");
	        	}else{
	        		$(".content").load("multiNode.html");
	        	}
	        	selectTemplate($( this ).attr('id'));
			});
	    }
	});
	
}

//选择安装的模板
function selectTemplate(templateId){
	$.ajax({
	    url:"/deploycluster/selecttemplate/"+templateId+"/1",
	    type: "GET",
	    dataType:"json",
	    success: function(data){
	    }
	}); 
}

//已完成安装
function installed(installData){
	$("#cluster").html("");
	$("#example1").attr('class','table table-bordered table-hover');
	$("#example1").attr('font-size','12px');
	if(installData.installType==2){
		$("#installtitle").html("系统检测到您已经安装Kubernetes集群（自动模式），以下是详细信息");
	}else{
		$("#installtitle").html("系统检测到您已经安装Kubernetes集群（手工模式），以下是详细信息");	
	}
	$("#example1").html('<tr><th>id</th><th>Host Name</th><th>IP</th><th>Cores</th><th>Memory</th><th>SSH login</th><th>Usage</th><th>location</th></tr>');
	$.ajax({
	    url:"/host/cluster-hosts/1",
	    type: "GET",
	    dataType:"json",
	    success: function(data){
	    	$.each(data,function(i,item){
	    		$("#example1").append("<tr><td>"+item.id+"</td><td>"+item.hostName+"</td><td>"+item.ip+"</td><td>"+item.cores+"</td><td>"+item.memory+"</td><td>"+item.sshLogin+"</td><td>"+item.usageFlag+"</td><td>"+item.location+"</td></tr>");
	    	});
	    	
	    }
	});
	
	$.ajax({
	    url:"/deploycluster/getk8s-alive-nodes/1",
	    type: "GET",
	    dataType:"text",
	    success: function(data){
	    	$.each(data,function(i,item){
	    		$("#example1").append("<tr><td>"+item.id+"</td><td>"+item.hostName+"</td><td>"+item.ip+"</td><td>"+item.cores+"</td><td>"+item.memory+"</td><td>"+item.sshLogin+"</td><td>"+item.usageFlag+"</td><td>"+item.location+"</td></tr>");
	    	});
	    },
	    error:function(){
	    	alert("报错!!!!");
	    }
	});
	
	$("#cluster").append("<span>name:"+installData.name+"</span><span>labels:"+installData.labels+"</span><span>k8sVersion:"+installData.k8sVersion+"</span><span>installType:"+installData.installType+"</span><span>lastUpdated:"+installData.lastUpdated+"</span>");
	
}

</script>
